/** 软件大屏底部导航部件
 * Author:      huoxj 
 * CreateTime:  2023/2/5 23:06:59 
 * LastEditor:  huoxj 
 * ModifyTime:  2023/12/5 19:34:03 
 * Description: 
*/ 
<template>
  <el-steps :active="active" :style="{width:props.width , height:props.height}">
    <el-step v-for="(item, index) in props.dataList" :key="index">
      <template #icon>
        <!-- <Icon icon="right-circle-outlined"></Icon> -->
        <!-- <right-circle-outlined /> -->
        <i v-if="active==index" class="right-circle-outlined"></i>
        <i v-else class="check-outlined"></i>
      </template>
      <template #title>
        <dv-decoration-11 style="width:200px; height:60px;">{{item.name}}</dv-decoration-11>
      </template>
    </el-step>    
  </el-steps>
</template>
<script setup lang="ts">
import { ref  , Ref , reactive , watchEffect} from 'vue';
import { propTypes } from '/@/utils/propTypes';

const props = defineProps({
  width: propTypes.string, 
  height: propTypes.string,
  dataList: propTypes.array.def([])});
let active = 0;

</script>
<style>
</style>
